Changing toggle styles to use flex box#4313
Conversation
phkuo
left a comment
phkuo
left a comment
There was a problem hiding this comment.
Looks great, thanks! We definitely prefer flexbox over absolute positioning.
You'll need to update the test snapshot with your style changes though: src/components/Toggle/Toggle.test.tsx
Run npm run update-snapshots in the packages\office-ui-fabric-react folder.
betrue-final-final
left a comment
betrue-final-final
left a comment
There was a problem hiding this comment.
Looks like you accidentally show the toggle as "off" instead of "on" when "on disabled".
|
@betrue-final-final It looks like screener was not picking up my latest commit for whatever reason. Now it's complaining that the toggle has changed, though running npm run update-snapshots doesn't update anything at this point. Any ideas? |
|
Not sure. I'll let the screener guy know. |
|
Did you check your snap tests? |
|
Looks like whatever you did fixed it! |
|
@phkuo snapshots are updated, let me know if it looks good |
| padding-left: .2em; | ||
| padding-right: .2em; | ||
| padding-top: 0; | ||
| position: relative; |
There was a problem hiding this comment.
hmm I'm surprised this didn't get removed
3 participants
Pull request checklist
$ npm run changeDescription of changes
Removing the absolute positioning on the toggle thumb and using flexbox positioning instead to keep the toggle aligned correctly for all text sizes.
Focus areas to test
Test that toggles render correctly for multiple text sizes